Skip to content

ADMIN-006: Verify Configuration Page functionality#61908

Open
amankum2004 wants to merge 1 commit intoapache:mainfrom
amankum2004:ui-e2e-test-Admin-006
Open

ADMIN-006: Verify Configuration Page functionality#61908
amankum2004 wants to merge 1 commit intoapache:mainfrom
amankum2004:ui-e2e-test-Admin-006

Conversation

@amankum2004
Copy link

PR Description: Add E2E Coverage for Configuration Page

Summary

  • Adds end-to-end coverage for Configuration page behavior in the new UI.
  • Introduces a dedicated Page Object for the Config page.
  • Makes assertions configurable through testConfig so tests are reusable across environments.

What Changed

  • Added ConfigsPage page object:
    • airflow-core/src/airflow/ui/tests/e2e/pages/ConfigsPage.ts
    • Encapsulates Config page selectors and helpers (navigate, waitForLoad, row parsing, section/key matching).
  • Added Config E2E spec:
    • airflow-core/src/airflow/ui/tests/e2e/specs/configs.spec.ts
    • Covers page render, Admin menu navigation, and row validations.
    • Handles both supported runtime states:
      • Config table exposed.
      • Config values hidden with 403 Forbidden message.
  • Extended Playwright testConfig:
    • airflow-core/src/airflow/ui/playwright.config.ts
    • Added configPage options:
      • path
      • expectedHeading
      • expectsTableData
      • expectedSection
      • expectedKey
      • forbiddenMessage
  • Updated E2E docs:
    • airflow-core/src/airflow/ui/tests/e2e/README.md
    • Documented new Config-page-related env vars.

Test Coverage Added

  • verify configuration displays
  • verify configuration page is accessible via Admin menu
  • verify configuration section and key are rendered (when TEST_CONFIG_PAGE_EXPECTS_TABLE_DATA=true)
  • verify section, key and value are populated in configuration rows (when TEST_CONFIG_PAGE_EXPECTS_TABLE_DATA=true)

Acceptance Criteria Mapping

  • Page Object Model pattern: Met (ConfigsPage + spec uses page object methods).
  • Tests use testConfig: Met (testConfig.configPage drives path and assertions).
  • Works across Chromium, Firefox, WebKit: Met by Playwright project configuration and spec compatibility.

Notes

  • The UI route under test is /configs (plural).
  • By default, tests assume many environments hide config values for security:
    • TEST_CONFIG_PAGE_EXPECTS_TABLE_DATA=false (default) validates the 403 Forbidden state.
  • To validate table content in an environment that exposes configuration values:
    • Set TEST_CONFIG_PAGE_EXPECTS_TABLE_DATA=true
    • Optionally override TEST_CONFIG_PAGE_SECTION and TEST_CONFIG_PAGE_KEY.

@boring-cyborg boring-cyborg bot added the area:UI Related to UI/UX. For Frontend Developers. label Feb 14, 2026
@amankum2004
Copy link
Author

@vatsrahul1001 Hello sir, I have created this PR to fix the issue - UI E2E Test || ADMIN-006: Verify Configuration Page functionality #60572
Kindly review the request. If any changes or modifications are required from my side then please comment.

@amankum2004 amankum2004 force-pushed the ui-e2e-test-Admin-006 branch from 6132e50 to a367875 Compare February 14, 2026 13:35
@amankum2004 amankum2004 force-pushed the ui-e2e-test-Admin-006 branch from a367875 to 1cf5383 Compare February 14, 2026 14:26
@vatsrahul1001
Copy link
Contributor

@vatsrahul1001 Hello sir, I have created this PR to fix the issue - UI E2E Test || ADMIN-006: Verify Configuration Page functionality #60572 Kindly review the request. If any changes or modifications are required from my side then please comment.

Thanks @amankum2004 I will review soon

name: process.env.TEST_ASSET_NAME ?? "s3://dag1/output_1.txt",
},
connection: {
baseUrl: process.env.AIRFLOW_UI_BASE_URL ?? "http://localhost:28080",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why have we removed this?


public async waitForLoad(): Promise<void> {
await this.heading.waitFor({ state: "visible", timeout: 30_000 });
await this.page.waitForFunction(
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can just use

await expect(this.table.or(this.forbiddenStatus)).toBeVisible({ timeout: 30_000 });

};
}

public async hasSectionAndKey(section: string, key: string): Promise<boolean> {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should use filter

public async hasSectionAndKey(section: string, key: string): Promise<boolean> {
  const row = this.rows.filter({ hasText: section }).filter({ hasText: key });
  return (await row.count()) > 0;
}

@@ -112,6 +112,12 @@ Environment variables (with defaults):
- `TEST_USERNAME` - Username (default: `airflow`)
- `TEST_PASSWORD` - Password (default: `airflow`)
- `TEST_DAG_ID` - Test DAG ID (default: `example_bash_operator`)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why do we need so many config? I think only TEST_CONFIG_PAGE_EXPECTS_TABLE_DATA might be required

@vatsrahul1001
Copy link
Contributor

@amankum2004 can you look at failing test?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:UI Related to UI/UX. For Frontend Developers.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants